import React, { Component } from 'react';
import { getMultiLang, cardCache, base, createPage, toast, pageTo,viewModel } from 'nc-lightapp-front';
import api from '../../common/api';
import config from './config';
import _ from 'lodash-es';
import './index.less';
const { NCButton } = base
const { setDefData, getDefData } = cardCache;
class TradeTypeModal extends Component {
    constructor(props) {
        super(props);
        this.state = {
            multiLang: {},
            detailList: [],
            mactrlInfo: {}
        }
    }

    componentDidMount() {
        this.loadData()
        this.initTempAndLang();
    }

    initTempAndLang() {
        const props = this.props;
        getMultiLang({
            ...config.multiLang,
            callback: (json) => {
                this.setState({ multiLang: json }, () => {
                    props.createUIDom({ pagecode: config.pagecode }, (data) => {
                        this.setMeta(data.template);
                    });
                });
            }
        });
    }

    setMeta(meta) {
        const props = this.props;
        setDefData(`${config.tradetypeArea}_oid`, config.datasource, meta[config.tradetypeArea].oid);
        props.meta.setMeta(meta, () => {
            this.loadData();
        });
    }

    loadData() {
        this.getTradeTypeList(this.props.visible).then((data) => {
            console.log(data,'======')
            const TradeModal = _.get(data, 'tradeTypeList.TradeModal', {});
            this.state.detailList = _.get(data, 'detailList', []);
            this.state.mactrlInfo = _.get(data, 'mactrlInfo', {});
            this.props.table.setAllTableData(config.tradetypeArea, TradeModal);
        });
    }

    async getTradeTypeList(visible) {
        let data = getDefData(`tradetype-ifcz-${visible ? 'true' : 'false'}`, config.cache);
        if (data) {
            return data;
        }
        data = await api.getTradeType();
        setDefData(`tradetype-ifcz-${visible ? 'true' : 'false'}`, config.cache, data);
        return data;
    }

    onReimbursementButtonClick() {
        const { table, modal, that } = this.props;
        const checkedRows = table.getCheckedRows(config.tradetypeArea);
        const record = _.get(checkedRows, '[0].data.values');
        const tradeType = _.get(record, 'pk_billtypecode.value', '');
        let pagecode = _.get(record, 'pagecode.value');
        let appcode = _.get(record, 'appcode.value');
        let url = _.get(record, 'url.value');
        let pk_tradetypeid = _.get(record, 'pk_billtypeid.value','');
        if (checkedRows.length !== 1) {
            toast({
                color: 'warning',
                content: this.state.multiLang['select_one_row']
            });
            return false;
        }
        for(let key in this.state.mactrlInfo) {
            if(key === tradeType) {
                toast({
                    color: 'warning',
                    content: this.state.mactrlInfo[key]
                });
                return false
            }
        }
        for(let key in this.state.detailList) {
            if(key === tradeType) {
                if(this.state.detailList[tradeType] && this.state.detailList[tradeType].length > 1){
                    this.props.detailType(this.state.detailList[key],{appcode,pagecode,url,pk_tradetypeid})
                    this.props.close();
                    this.props.onShowDetail();
                }
                else{
                    const tablecodeSpilt = this.props.checkedList.map(item=>{
                        const values = _.get(item, 'values');
                        const pk_erminvoice = _.get(values, 'pk_erminvoice.value','')
                        const pk_ermorder = _.get(values, 'pk_ermorder.value','')
                        const tablecode = _.get(this.state.detailList[key], '[0].code','')
                        // 发票列表
                        if(that.listTabStatus === '0'){
                            return {
                                pk_erminvoice,
                                tablecode
                            }
                        }
                        // 订单列表
                        if(that.listTabStatus === '1'){
                            return {
                                pk_ermorder,
                                tablecode
                            }
                        }
                    })
                    console.log(tablecodeSpilt,'tablecodeSpilt===')
                    pageTo.specialOpenTo(url, {
                        pagecode,
                        appcode,
                        status: 'add',
                        tablecodeSpilt: JSON.stringify(tablecodeSpilt),
                        pk_tradetypeid,
                        from: that.listTabStatus === '0' ? 'walletInvoicePage' : 'walletOrderPage'
                    });
                }
            }
        };
    }

    onCancelButtonClick() {
        this.props.close()
    }

    onTableSelected(props, moduleId, record, index, selected) {
        const { table } = this.props;
        table.selectAllRows(moduleId, false);
        table.selectTableRows(moduleId, index, true);
    }

    render() {
        const { table } = this.props;
        const { createSimpleTable } = table;
        return (
            <div className="trade-type-list">
                <div className="nc-singleTable-table-area">
                    {createSimpleTable(config.tradetypeArea, {
                        onSelected: this.onTableSelected.bind(this),
                        showIndex: true,
                        showCheck: false
                    })}
                </div>
                <div className="nc-singleTable-button-area">
                    <NCButton
                        colors="primary"
                        onClick={this.onReimbursementButtonClick.bind(this)}
                    >
                        {this.state.multiLang['confirm']}
                    </NCButton>
                    <NCButton
                        style={{ marginLeft: 16 }}
                        onClick={this.onCancelButtonClick.bind(this)}
                    >
                        {this.state.multiLang['cancel']}
                    </NCButton>
                </div>
            </div>
        )
    }
}

export default createPage({
    mutiLangCode: config.multiLang.moduleId,
    initTemplate: null
})(TradeTypeModal);
